<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>画图模块</title>
		<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
</head>
<script type="text/javascript">
    var vM; //定义重命名地图对象变量名称

    function InitMap() {
        vM = vEdushiMap;

       
 
       
        _CircleLayer = vM.NewMapLayer('CircleLayer', 271, true);

        _DotLayer = vM.NewMapLayer('DotLayer',271,true);

		 /*vM.LoadModule('Circle', function() {//因为把CircleIng，CircleEnd单独定义在了Circle.js中，所以需要在模块加载完毕后再去注册事件
            vM.attachEvent(AlaMap.KeyWord.EventName.CircleIng, function(x, y, r1, r2, disr1, disr2) {
            });
 
            vM.attachEvent(AlaMap.KeyWord.EventName.CircleEnd, function(x, y, r1, r2, disr1, disr2) {
                _lastCircle = { X: x, Y: y, R1: r1, R2: r2 };
                DrawDragCircle();
                alert(string.Format("[CircleEnd]，[返回]：x:{0},y:{1},r1:{2},r2:{3},disr1:{4},disr2:{5}",
                                    x,
                                    y,
                                    r1,
                                    r2,
                                    disr1,
                                    disr2));
            });
        });

        vM.LoadModule('Area', function() {
            vM.attachEvent(AlaMap.KeyWord.EventName.AreaEnd, function(area, flg) {
                                    //alert('面积'+area+'平方米');
                //area:面积，flg:true->系统执行了stop，false->人工执行了stop
                alert(string.Format("[AreaEnd]，[返回]：area:{0},flg:{1}",
                area,flg));
            });
        });
		*/
    }
	

    var _LineLayer;
	function DrawLineTest(value,value1) {
	 //创建各类图层，二次开发往地图上加东西的'容器'
        _LineLayer = vM.NewMapLayer('LineLayer', 270, true);
        var coords = '18360,32792,18698,32650,19038,32566,19318,32470,19600,32604,19544,32666,19462,32718,19372,32812,19262,32886,19152,32902,19010,32930,18974,33030,19316,33120,19458,33206';
		var coord2 = '18460,32792,18698,32650,19038,32566,19418,32470,19600,32604,19544,32666,19462,32918,19372,32812,19262,32886,19152,32602,19210,32530,18674,33230,19416,33220,19558,33306';
        _LineLayer.innerHTML = '';
 _LineLayer.id = "test";
        //地图坐标(AlaMap坐标需要转换成相对于盒子的坐标,画poly同理
        vM.DrawPolyLine(_LineLayer, coords, 4, '#ff3300', 0.7);
		vM.DrawPolyLine(_LineLayer, coord2, 4, '#ff3300', 0.7);
        //注册级别切换事，重绘事件
        vM.detachEvent(AlaMap.KeyWord.EventName.MapZoomChange, DrawLineTest);
        vM.attachEvent(AlaMap.KeyWord.EventName.MapZoomChange, DrawLineTest, []);
 
        vM.detachEvent(AlaMap.KeyWord.EventName.Repaint, DrawLineTest);
        vM.attachEvent(AlaMap.KeyWord.EventName.Repaint, DrawLineTest);
 
    }
	var _PolyLayer0;
	var _PolyLayer1;
	var _PolyLayer2;
	function DrawPolyTest0(index) {
	  _PolyLayer0 = vM.NewMapLayer('PolyLayer0', 271, true);
 		var coordsArr = [
		'10536,14528.5,10608,14590.5,11646,14466.5,10590,14468.5,10504,14276.5,10536,14528.5',
		'10636,14728.5,10608,14890.5,11656,14466.5,10590,14568.5,10544,14276.5,10636,14728.5',
		'10536,14528.5,10658,14590.5,11946,14466.5,10590,14868.5,10504,14876.5,10536,14528.5'
		];
        //window.status = Math.random();
        var coords = '18992,33914,19336,33874,19900,33770,20120,33728,20170,33720,20292,33816,20306,33860,20148,33912,19550,34016,19242,34046,19034,34082,18920,34092,18846,34044,18992,33912';
        _PolyLayer0.innerHTML = '';
 
        vM.DrawPoly(_PolyLayer0, coordsArr[index], 1, 'yellow', 'black', 0.7);
 
        vM.detachEvent(AlaMap.KeyWord.EventName.MapZoomChange, DrawPolyTest0);
        vM.attachEvent(AlaMap.KeyWord.EventName.MapZoomChange, DrawPolyTest0);
 
        vM.detachEvent(AlaMap.KeyWord.EventName.Repaint, DrawPolyTest0);
        vM.attachEvent(AlaMap.KeyWord.EventName.Repaint, DrawPolyTest0);
 
    }
		function DrawPolyTest1(index) {
	  _PolyLayer1 = vM.NewMapLayer('PolyLayer1', 271, true);
 		var coordsArr = [
		'10536,14528.5,10608,14590.5,11646,14466.5,10590,14468.5,10504,14276.5,10536,14528.5',
		'10636,14728.5,10608,14890.5,11656,14466.5,10590,14568.5,10544,14276.5,10636,14728.5',
		'10536,14528.5,10658,14590.5,11946,14466.5,10590,14868.5,10504,14876.5,10536,14528.5'
		];
        //window.status = Math.random();
        var coords = '18992,33914,19336,33874,19900,33770,20120,33728,20170,33720,20292,33816,20306,33860,20148,33912,19550,34016,19242,34046,19034,34082,18920,34092,18846,34044,18992,33912';
        _PolyLayer1.innerHTML = '';
 
        vM.DrawPoly(_PolyLayer1, coordsArr[index], 1, 'yellow', 'black', 0.7);
 
        vM.detachEvent(AlaMap.KeyWord.EventName.MapZoomChange, DrawPolyTest1);
        vM.attachEvent(AlaMap.KeyWord.EventName.MapZoomChange, DrawPolyTest1);
 
        vM.detachEvent(AlaMap.KeyWord.EventName.Repaint, DrawPolyTest1);
        vM.attachEvent(AlaMap.KeyWord.EventName.Repaint, DrawPolyTest1);
 
    }
		function DrawPolyTest2(index) {
	  _PolyLayer2 = vM.NewMapLayer('PolyLayer2', 271, true);
 		var coordsArr = [
		'10536,14528.5,10608,14590.5,11646,14466.5,10590,14468.5,10504,14276.5,10536,14528.5',
		'10636,14728.5,10608,14890.5,11656,14466.5,10590,14568.5,10544,14276.5,10636,14728.5',
		'10536,14528.5,10658,14590.5,11946,14466.5,10590,14868.5,10504,14876.5,10536,14528.5'
		];
        //window.status = Math.random();
        var coords = '18992,33914,19336,33874,19900,33770,20120,33728,20170,33720,20292,33816,20306,33860,20148,33912,19550,34016,19242,34046,19034,34082,18920,34092,18846,34044,18992,33912';
        _PolyLayer2.innerHTML = '';
 
        vM.DrawPoly(_PolyLayer2, coordsArr[index], 1, 'yellow', 'black', 0.7);
 
        vM.detachEvent(AlaMap.KeyWord.EventName.MapZoomChange, DrawPolyTest2);
        vM.attachEvent(AlaMap.KeyWord.EventName.MapZoomChange, DrawPolyTest2);
 
        vM.detachEvent(AlaMap.KeyWord.EventName.Repaint, DrawPolyTest2);
        vM.attachEvent(AlaMap.KeyWord.EventName.Repaint, DrawPolyTest2);
 
    }
    var _CircleLayer;
	function DrawCircleTest() {
        _CircleLayer.innerHTML = '';
        //地图坐标(AlaMap坐标需要转换成相对于盒子的坐标,画poly同理
        vM.DrawCircle(_CircleLayer, 18360, 32792, 70, 60, 1, 'yellow', 'black', 0.7);
        //注册级别切换事，重绘事件
        vM.detachEvent(AlaMap.KeyWord.EventName.MapZoomChange, DrawCircleTest);
        vM.attachEvent(AlaMap.KeyWord.EventName.MapZoomChange, DrawCircleTest);
        vM.detachEvent(AlaMap.KeyWord.EventName.Repaint, DrawCircleTest);
        vM.attachEvent(AlaMap.KeyWord.EventName.Repaint, DrawCircleTest);
    }

    //画点
    var _DotLayer;
    function DotTest() {
        _DotLayer.innertHTML = '';
        vM.DrawDot(_DotLayer, 18360, 32792,1,'black',0.1);
        //注册级别切换事，重绘事件
        vM.detachEvent(AlaMap.KeyWord.EventName.MapZoomChange, DotTest);
        vM.attachEvent(AlaMap.KeyWord.EventName.MapZoomChange, DotTest);
        vM.detachEvent(AlaMap.KeyWord.EventName.Repaint, DotTest);
        vM.attachEvent(AlaMap.KeyWord.EventName.Repaint, DotTest);
    }
	function show(){
	if(_PolyLayer0){
	_PolyLayer0.innerHTML = '';
	}
		
		if(_PolyLayer1){
	_PolyLayer1.innerHTML = '';
	}
		_PolyLayer0.innerHTML = '';
		if(_PolyLayer2){
	_PolyLayer2.innerHTML = '';
	}
		

		
	}
</script>
<body onload="InitMap();">    
    <input style="cursor:pointer;margin-left:5px;" type="button" onclick="vM.MoveTo(19318, 32470);DrawLineTest();" value="画线" />
	<input style="cursor:pointer;margin-left:5px;" type="button" onclick="show();" value="隐藏" />
    <input style="cursor:pointer;margin-left:5px;" type="button" onclick="DrawPolyTest0(0);vM.MoveTo(10536,14528);" value="画多边形" />
	<input style="cursor:pointer;margin-left:5px;" type="button" onclick="DrawPolyTest1(1);vM.MoveTo(10536,14528);" value="画多边形" />
	<input style="cursor:pointer;margin-left:5px;" type="button" onclick="DrawPolyTest2(2);vM.MoveTo(10536,14528);" value="画多边形" />
    <input style="cursor:pointer;margin-left:5px;" type="button" onclick="DrawCircleTest();vM.MoveTo(18360, 32792);" value="画圆" />
    <input style="cursor:pointer;margin-left:5px;" type="button" onclick="DotTest();vM.MoveTo(18360, 32792);" value="画点" />
    <div id="vMEdushiMap">
	
    </div>
</body>
</html>
<!--//--------------加载地图----------------------------------------->
<script type="text/javascript" src="http://apiinkey.alayun.net/?mapid=vMEdushiMap&city=hangzhou&w=1120&h=540&x=7050&y=12866&eye=false&ew=180&eh=140&e=utf-8&z=1&v=2&zb=false&s=false"></script>
<!--//--------------加载地图----------------------------------------->
